<template>
    <span class="i-layout-header-trigger i-layout-header-trigger-min">
        <Dropdown @on-click="changestyle">
            <Icon type="ios-shirt-outline"/>
            <DropdownMenu slot="list" >
                <DropdownItem :name="1" >黑白主题</DropdownItem>
                <DropdownItem :name="2" >暗黑主题</DropdownItem>
            </DropdownMenu>
        </Dropdown>
    </span>
</template>
<script>
    import util from '@/libs/util';
    export default {
        data () {
            return {
                whiteShow: false,
                darkShow: false
            }
        },
        methods: {
            // 顶部操作切换
            changestyle (name) {
                if (name === 1) {
                    this.whiteShow = true;
                    this.darkShow = false;
                    util.storage.set('white', this.whiteShow)
                    util.storage.set('dark', this.darkShow)
                    document.getElementsByTagName('body')[0].classList.add('witle');
                    document.getElementsByTagName('body')[0].classList.remove('dark');
                    document.getElementsByTagName('body')[0].classList.remove('ivu-theme-dark');
                    // window.location.reload()
                    this.$store.commit('admin/menu/setTheme', 'white');
                } else {
                    this.darkShow = true;
                    this.whiteShow = false;
                    util.storage.set('dark', this.darkShow)
                    util.storage.set('white', this.whiteShow)
                    document.getElementsByTagName('body')[0].classList.add('dark');
                    document.getElementsByTagName('body')[0].classList.add('ivu-theme-dark');
                    document.getElementsByTagName('body')[0].classList.remove('witle');
                    // window.location.reload()
                    this.$store.commit('admin/menu/setTheme', 'black');
                }
            }
        }
    }
</script>
